<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :formType="type" @formChange="formChangeHandle" :isSubmitBtn="false" :collapse="false" labelWidth="110" />
    <BreakSpace label="操作记录" :containerStyle="{ marginBottom: '10px' }" />
    <FilterTable ref="table" :isSelectColumn="false" height="auto" :columns="columns" :dataSource="tableList" :onColumnsChange="columns => (this.columns = columns)"> </FilterTable>

    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'center'
      }"
    >
      <multiuse-button type="primary" v-show="type != 'show'" :click="saveDataHandle.bind(this, 'businessunit')">通 过</multiuse-button>
      <multiuse-button type="primary" v-show="type != 'show'" :click="saveDataHandle.bind(this, 'deptRefuse')">拒 绝</multiuse-button>
      <el-button @click="closeDrawer">关 闭</el-button>
    </div>
  </div>
</template>
<script>
import moment from 'moment';
import { dictionary } from '@/utils/dictMixin';
import { queryById, saveData, queryRecordById } from '@/api/omSale/TestDrive/BusinessUnitApproval';

export default {
  mixins: [dictionary],
  props: ['type', 'rowData'],

  data() {
    this.saveData = null;
    return {
      formList: this.createdFrom(),
      columns: this.createdTable(),
      tableList: []
    };
  },
  created() {
    this.init();
    this.queryRecordByIdFun();
  },
  methods: {
    async init() {
      const res = await queryById(this.rowData.id);
      if (res.resultCode == 200) {
        this.formList.map(x => {
          x.initialValue = res.data[x.fieldName];
        });
      }
    },
    async queryRecordByIdFun() {
      const res = await queryRecordById(this.rowData.id);
      this.tableList = [];
      if (res.resultCode == 200) {
        this.tableList = res.data;
      }
    },
    formChangeHandle(val) {
      this.saveData = val;
    },
    async saveDataHandle(status) {
      this.formList.find(x => x.fieldName == 'checkRemark').rules[0].required = status == 'deptRefuse' ? true : false;
      this.$refs.formPanel.SUBMIT_FORM();
      if (this.saveData) {
        let params = {
          id: this.rowData.id,
          checkStatus: status == 'businessunit' ? 60761004 : 60761003,
          queryType: status,
          checkRemark: this.saveData.checkRemark
        };
        let res = await saveData(params);

        if (res.resultCode == 200) {
          this.$notify.success({ title: '提示信息', message: '操作成功' });
          this.$emit('close', false, 'refresh');
        }
      }
    },
    closeDrawer() {
      this.$emit('close');
    },

    createdFrom() {
      return [
        {
          type: 'BREAK_SPACE',
          label: '审批信息'
        },
        {
          type: 'SELECT',
          label: '订单类型',
          fieldName: 'orderType',
          initialValue: 60401003,
          itemList: [
            { text: '在途车', value: 60401002 },
            { text: '库存车', value: 60401003 }
          ],
          disabled: true
        },
        // {
        //   type: 'SELECT',
        //   label: '是否首台',
        //   fieldName: 'isFirst',
        //   placeholder: '',
        //   itemList: this.createDictList('1004'),
        //   disabled: true
        // },
        {
          type: 'INPUT',
          label: 'VIN',
          fieldName: 'vin',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '申请单号',
          fieldName: 'applyNo',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '订单号',
          fieldName: 'orderNo',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '订购数量',
          fieldName: 'reportCount',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '产品代码',
          fieldName: 'productCode',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '车系',
          fieldName: 'seriesName',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '车型',
          fieldName: 'modelName',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '配置',
          fieldName: 'packageName',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '选装',
          fieldName: 'optionName',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '内饰',
          fieldName: 'trimName',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '外饰',
          fieldName: 'colorName',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '折后单价',
          fieldName: 'unitPrice',
          placeholder: '请输入',
          disabled: true
        },
        {
          type: 'SELECT',
          label: '申请状态',
          fieldName: 'checkStatus',
          itemList: this.createDictList('6076'),
          disabled: true
        },
        {
          type: 'DATE',
          label: '录入时间',
          fieldName: 'createdAt',
          disabled: true,
          dateType: 'exactdate',
          initialValue: moment().format('YYYY-MM-DD')
        },
        {
          type: 'TEXT_AREA',
          label: '备注',
          fieldName: 'remark',
          disabled: true,
          selfCols: 3,
          rows: 2
        },
        {
          type: 'BREAK_SPACE',
          label: '审批意见'
        },
        {
          type: 'TEXT_AREA',
          label: '审批意见',
          fieldName: 'checkRemark',
          selfCols: 3,
          placeholder: '',
          rules: [{ required: false, message: '请输入', trigger: 'blur' }]
        }
      ];
    },
    createdTable() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 80,
          sorter: true,
          fixed: 'left',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '单据执行前状态',
          dataIndex: 'frontStatus',
          filterType: 'checkbox',
          filterItems: this.createDictList('6076'),
          render: props => {
            return <span>{this.createDictText(props.row.frontStatus, '6076')}</span>;
          }
        },
        {
          title: '单独执行后状态',
          dataIndex: 'returnStatus',
          filterType: 'checkbox',
          filterItems: this.createDictList('6076'),
          render: props => {
            return <span>{this.createDictText(props.row.returnStatus, '6076')}</span>;
          }
        },
        {
          title: '操作人员',
          dataIndex: 'createdByName'
        },
        {
          title: '操作时间',
          dataIndex: 'createdAt'
        },
        {
          title: '操作类型',
          dataIndex: 'operation'
        },
        {
          title: '审批意见',
          dataIndex: 'remark'
        }
      ];
    }
  }
};
</script>
